import React, { Component } from 'react'
import Details from './Details'
import {Route} from 'react-router-dom'
export default class Message extends Component {

    clickItem = (item) => {
        this.props.history.push(`/home/message/details/${item.id}/${item.title}`)
    }

    render() {
        let arr = [
            { id: 1, title: "这是1" },
            { id: 2, title: "这是2" },
            { id: 3, title: "这是3" },
        ]
        return (
            <div>
                <ul>
                    {
                        arr.map(item => {
                            return <li key={item.id} onClick={()=>this.clickItem(item)}>{item.title}</li>
                        })
                    }
                </ul>
                <hr />
                <h2>这是内容区</h2>
                <Route path="/home/message/details/:id/:title" component={Details}/>
            </div>
        )
    }
}
